import React, { Component } from 'react';
import { Form, Input, Button, Modal, Upload, message } from 'antd';
import Tips from '../../Tips/index';
import axios from 'axios';
import { connect } from 'react-redux';
axios.defaults.headers.post['Content-Type'] = 'application/json;charset=UTF-8';
const FormItem = Form.Item;
class upgrade extends Component {
  constructor(props) {
    super(props);
    this.state = {
      installPath: '',
      message: ''
    };
  }
  cancel = () => {
    this.setState({
      installPath: ''
    });
    this.props.onCancel();
  }
  tips = (str) => {
    this.setState({
      message: str
    });
    setTimeout(() => {
      this.setState({
        message: ''
      });
    }, 1000);
  }
  creat = (num) => {
    this.props.form.validateFields((err, values) => {
      if (!err) {
        this.props.onCreate(num, this.state.installPath);
        console.log('Received values of form: ', values);
      }
    });
  }
  componentWillReceiveProps(nextProps) {
    if (nextProps.upgradeclose) {
      this.cancel();
    }
  }
  render() {
    const { visible } = this.props;
    const { getFieldDecorator, getFieldValue } = this.props.form;
    // 上传文件
    const _this = this;
    const Token = localStorage.getItem('token');
    const upload = {
      name: 'file',
      showUploadList: false,
      action: '/api/block/chainCode/upload',
      headers: {
        Authorization: Token
      },
      beforeUpload(file, fileList) {
        var fileExt = file.name.substr(file.name.lastIndexOf('.')).toLowerCase();
        if (fileExt != '.go') {
          message.error('文件必须为go文件!');
          return false;
        }
      },
      onChange(response) {
        const responseData = response.file.response;
        console.log(response);
        if (responseData && responseData.code == 200 && response.file.status == 'done') {
          _this.setState({
            installPath: responseData.data,
          });
        } else if (response.file.status == 'error') {
          message.error('上传失败！');
        }
      },
      onRemove(response) {
        _this.setState({
          installPath: ''
        });
      }
    };
    let num = 'V1.0';
    if (this.props.data && this.props.data['版本']) {
      num = this.props.data['版本'].split('.')[0].replace(/[^0-9]/ig, '');
      num = 'V' + (Number(num) + 1) + '.0';
    }
    console.log(this.props.upgradeLoading, 'loading');
    return (
      <div>
        <Modal
          visible={visible}
          title="升级Chaincode"
          onCancel={this.cancel}
          okText="安装升级"
          cancelText="取消"
          closable={false}
          onOk={this.creat.bind(this, num)}
          confirmLoading={this.props.upgradeLoading}
          destroyOnClose={true}
        >
          <Form>
            <FormItem
              label="网络"
              labelCol={{ span: 6 }}
              wrapperCol={{ span: 16 }}
            >
              <Input value={this.props.changeNetwork} disabled />
            </FormItem>
            <FormItem
              label="Name"
              labelCol={{ span: 6 }}
              wrapperCol={{ span: 16 }}
            >
              <Input value={this.props.data ? this.props.data['名称'] : ''} disabled />
            </FormItem>
            <FormItem
              label="当前版本"
              labelCol={{ span: 6 }}
              wrapperCol={{ span: 16 }}
            >
              <Input value={this.props.data ? this.props.data['版本'] : ''} disabled />
            </FormItem>
            <FormItem
              label="升级版本"
              labelCol={{ span: 6 }}
              wrapperCol={{ span: 16 }}
            >
              <Input value={num} disabled />
            </FormItem>
            <FormItem
              label="Path"
              labelCol={{ span: 6 }}
              wrapperCol={{ span: 16 }}
            >
              {getFieldDecorator('installPath', {
                rules: [{ required: true, message: '请上传文件' }]
              })(
                <div>
                  <Input placeholder="请上传文件" style={{ width: 216 }} value={this.state.installPath} />
                  <Upload {...upload} className="uploadDiv">
                    <Button className="uploadBtn" type="primary">上传文件</Button>
                  </Upload>
                </div>
              )}
            </FormItem>
          </Form>
        </Modal>
        <Tips message={this.state.message} />
      </div>
    );
  }
}

const Upgrade = Form.create()(upgrade);
export default connect((state) => {
  return { ...state };
})(Upgrade);
